<template>
  <div class="equipmentMove flowCloumn h100">
    <div class="constentmain">
      <listTableNew v-bind="tableSetting" ref="klTable"></listTableNew>
    </div>
  </div>
</template>
<script>
import {
  getListApi, //列表
  deleteApi //删除
} from "@/api/equipmentLedger/equipmentMove";
export default {
  components: {},
  props: {
    //当前设备
    currentNode: {
      type: Object,
      default: () => {
        return {};
      }
    },
    menuType: {
      type: String,
      default: ""
    }
  },
  data() {
    return {
      pageType: "list",
      userInfo: this.$store.getters.userInfo,
      formData: {},
      currentDevice: {},
      tableSetting: {
        selectionShow: false,
        showCustomBtn: true,
        showFilterBtn: true,
        pageConfig: {
          pageCode: "equipmentMove",
          userId: this.$store.getters.userInfo.id
        },
        searchObj: {
          searchMethod: (params, sortStr) => {
            this.getTableData(params, sortStr);
          },
          queryData: {
            page: 1,
            pageSize: 15
          },
          searchArr: [
            {
              type: "input",
              label: "标题",
              model: "name"
            },
            {
              type: "organization",
              label: "设备管理单位",
              model: "equipDeptName",
              idsStr: "equipDept",
              methods: val => {}
            },
            {
              label: "状态",
              model: "statusList",
              type: "select",
              multiple: true,
              option: this.$store.getters["dirtData"]("equipment_change_status")
            },
            {
              type: "user", //user\organization
              label: "创建人",
              model: "createUserName",
              idsStr: "createUserId",
              placeholder: "请选择创建人",
              methods: val => {}
            },
            {
              label: "创建时间",
              model: "createTime",
              type: "daterange"
            }
          ]
        },
        actionList: [
          {
            name: "新建",
            icon: "el-icon-plus",
            disabled: !this.$store.getters["isBtnAuth"]("add"),
            content: this.$store.getters["isBtnAuth"]("add")
              ? null
              : "未授权此功能！",
            method: row => {
              this.pageType = "add";
              this.gotoDetails(row, "add");
            }
          }
        ],
        column: [
          {
            label: "编号",
            prop: "code"
          },
          {
            label: "标题",
            prop: "name"
          },
          {
            label: "设备名称",
            prop: "equipmentName"
          },
          {
            label: "设备管理单位",
            prop: "equipDeptName"
          },
          {
            label: "当前节点",
            prop: "curNodeName"
          },
          {
            label: "当前处理人",
            prop: "curNodeUserNames"
          },
          {
            label: "状态",
            prop: "status",
            scopeType: "formate",
            method: row => {
              return this.$store.getters["fineDirtDataName"](
                "equipment_change_status",
                row.status
              );
            }
          },
          {
            label: "创建人",
            prop: "createByName"
          },
          {
            label: "创建时间",
            prop: "createTime"
          }
        ],
        //表格方法
        tableMethods: {
          //点击行的方法
          rowClick: val => {
            this.gotoDetails(val);
          }
        }
      }
    };
  },
  watch: {
    currentNode: {
      handler: function(newVal, oldVal) {
        this.currentDevice = Object.assign({}, newVal);
        let queryData = Object.assign(this.tableSetting.searchObj.queryData, {
          equipmentId: newVal.id,
          equipmentName: newVal.name
        });
        this.tableSetting.searchObj.queryData = {};
        this.tableSetting.searchObj.queryData = queryData;
        setTimeout(() => {
          if (oldVal) {
            //不是第一次
            this.updateData();
          }
        }, 0);
      },
      deep: true,
      immediate: true
    }
  },
  computed: {},
  created() {
    /* 添加监听事件 */
    window.addEventListener("storage", this.updateData);
  },
  beforeDestroy() {
    /* 删除监听事件 */
    window.removeEventListener("storage", this.updateData);
  },
  mounted() {
    this.init();
  },
  methods: {
    init() {
      this.pageType = this.menuType || "edit";
      if (["query", "details"].includes(this.pageType)) {
        this.tableSetting.actionList = [];
        if (this.pageType == "query") {
          this.tableSetting.selectionShow = false;
          this.tableSetting.showCustomBtn = false;
          this.tableSetting.showFilterBtn = false;
          this.tableSetting.searchObj.searchArr = [
            {
              label: "状态",
              model: "statusList",
              type: "select",
              multiple: true,
              option: this.$store.getters["dirtData"]("equipment_change_status")
            },

          ];
          this.tableSetting.column = [
            {
              label: "编号",
              prop: "code"
            },
            {
              label: "异动原因",
              prop: "reason"
            },
            {
              label: "当前处理人",
              prop: "updateByName"
            },
            {
              label: "状态",
              prop: "status",
              formatter: row => {
                return this.$store.getters["fineDirtDataName"](
                  "equipment_change_status",
                  row.status
                );
              }
            },
            {
              label: "创建人",
              prop: "createByName"
            }
          ];
        }
      }
      if (this.pageType != "query") {
        this.$refs.klTable.getTableConfig();
        setTimeout(() => {
          this.updateData();
        }, 600);
      } else {
        this.updateData();
      }
    },
    updateData() {
      this.$refs.klTable.searchData();
    },
    getTableData(params, sortStr) {
      let form = { ...params };
      if (sortStr) {
        form.orders = sortStr;
      }
      // if (form.dateTime) {
      //   form.startTime = form.dateTime[0];
      //   form.endTime = form.dateTime[1];
      //   delete form.dateTime;
      // }
      getListApi(form)
        .then(res => {
          let data = res.data.list || [];
          let total = res.data.total || 0;
          this.$set(this.tableSetting, "tableData", data);
          this.$set(this.tableSetting, "totalNumber", total);
        })
        .catch(e => {
          this.$set(this.tableSetting, "tableData", []);
          this.$set(this.tableSetting, "totalNumber", 0);
        });
    },
    //设置实体类节点参数表单
    setEntityConfig(data) {
      let entityItem = [];
      let entityFormData = {};
      data.map(i => {
        entityFormData[i.paramId] = i.paramValue;
        let item = {
          label: i.paramName,
          prop: i.paramId,
          type: i.enterType,
          required: i.must,
          span: 8
        };
        if (["radio", "select"].includes(i.enterType)) {
          let enterValue = i.dataText.split(",");
          let option = [];
          enterValue.map(j => {
            let optionItem = {
              value: j,
              label: j
            };
            option.push(optionItem);
          });
          let optionName = i.enterType + "Option";
          item[optionName] = option;
        }
        entityItem.push(item);
      });
      if (["query", "details"].includes(this.pageType)) {
        entityItem.map(i => (i.disabled = true));
      }
      this.entityConfig.itemArr = entityItem;
      this.entityData = entityFormData;
    },
    //打开详情页
    gotoDetails(data, isAdd) {
      if (!isAdd) {
        //不是新建
        if (["1", "2"].includes(data.status)) {
          this.pageType = "details";
        } else if (data.status == "0") {
          this.pageType = "edit";
        }
      }
      let form = {
        pageType: this.pageType,
        deviceId: this.currentDevice.id
      };
      if (!isAdd) {
        form.id = data.id;
        form.status = data.status;
      }
      let { href } = this.$router.resolve({
        path: "/equipmentMove/details",
        query: form
      });
      window.open(href, "_blank");
    }
  }
};
</script>
<style lang="less" scoped>
.equipmentMove {
  height: 100%;
  min-height: 500px;
  border-radius: 8px;
  background-color: #ffffff;
  .constentmain {
    margin: 20px;
    height:100%;
  }
}
.flowCloumn {
  display: flex;
  flex-flow: column nowrap;
}
.flowWrap {
  display: flex;
  flex-flow: wrap nowrap;
}
</style>